<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>中兴商城</title>
    <link rel="stylesheet" href="homePage.css">
    <!-- <link rel="stylesheet" href="download/font_2136908_xlrccicccv/iconfont.css">
    <script src="download/font_2136908_xlrccicccv/iconfont.js"></script> -->
</head>

<body>
    <div class="head">
        <div class="headbox">
            <img src="img/icon_home.png" alt="">
            <span>首页</span>
            <span class="login"><a href="../project 2/login.html">登录  | </a></span>

            <span class="register"><a href="../project 2/register.html">注册</a></span>
            <ul>
                <li>会员中心</li>
                <li>我的订单</li>
                <li class="li">手机商城<i></i></li>
            </ul>
            <div class="img">
                <img src="img/2.png" alt=""></br>
                <span>用手机扫一扫</span>
            </div>
        </div>
    </div>
    <div class="header">
        <div class="header_count">
            <div class="logo">
                <img src="img/logo.png" alt="">
            </div>
            <div class="link">
                <input type="text">
                <a href="">搜索</a>
                <p>热门关键词：<span>Axon 20 &ensp;Axon11 SE 5G &ensp;Axon11 5G</span> </p>
            </div>
            <div class="shopping">
                <div class="buyCar">
                    <span class="iconfont icon-gouwuche"></span>
                    <span style="margin-left: 5px;"><a href="../project 2/cart.html">查看购物车</a></span>
                    <b>0</b>
                </div>
            </div>
        </div>
        <div class="nav">
            <ul>
                <li class="list">全部商品分类</li>
                <li>首页</li>
                <li>Axon系列</li>
                <li>Blade系列</li>
                <li>线上服务站</li>
                <li>中兴社区</li>
                <li>线下门店</li>
                <li>会员中心</li>
            </ul>
        </div>
    </div>
    <div class="slideshow">
        <div class="banner">
            <img src="img/img1.jpg" alt="" style="display: block;">
            <img src="img/img2.jpg" alt="">
            <img src="img/img3.jpg" alt="">
            <img src="img/img4.jpg" alt="">
            <img src="img/img6.jpg" alt="">
        </div>
        <div class="dot"></div>
        <p class="p"></p>
        <div class="menu">
            <ul>
                <li><img src="img/photo.jpg" alt="">智能手机<span class="iconfont icon-jiantou"></span></li>
                <li><img src="img/terminal1.jpg" alt="">智能终端<span class="iconfont icon-jiantou"></span></li>
                <li><img src="img/audio.jpg" alt="">影音娱乐<span class="iconfont icon-jiantou"></span></li>
                <li><img src="img/recharge.jpg" alt="">手机充电<span class="iconfont icon-jiantou"></span></li>
                <li><img src="img/parts.jpg" alt="">手机配件<span class="iconfont icon-jiantou"></span></li>
                <li><img src="img/rest.jpg" alt="">服务/其他<span class="iconfont icon-jiantou"></span></li>
            </ul>

        </div>

        <div class="Submenu">
            <img src="img/img5.jpg" alt="" style="margin-top: 5px;"></br>
            <span class="one"></span><b>Axon系列</b><span class="two"></span>
            <ul>
                <li><img src="img/photo2.png" alt="">中兴天机Axon20 5G</br>屏下摄像手机</li>
                <li><img src="img/photo.jpg" alt="">中兴天机Axon11 5G</br>5G视频手机做自己的导演</li>
                <li><img src="img/photo4.jpg" alt="">天机Axon 10 Pro 5G</br>5G先锋 为快不破</li>
                <li><img src="img/photo5.jpg" alt="">天机Axon 11 SE 5G</br>视频双路防抖 360度环...</li>
            </ul>
            <span class="one"></span><b>Blade系列</b><span class="two"></span>
            <ul>
                <li><img src="img/photo6.jpg" alt="">V2020Smart</br>大电量 大存储 大屏幕...</li>
                <li><img src="img/photo7.jpg" alt="">A7s</br>大电池、大内存</li>
            </ul>
            <span class="one"></span><b>其他</b><span class="two"></span>
            <ul>
                <li><img src="img/photo8.jpg" alt="">红魔 5G</br>5G游戏手机</li>

            </ul>
        </div>
        <div class="Submenu">
            <p>
                <span></span><b>便携投影</b><span></span>
            </p>
            <ul>
                <li><img src="img/be155764953f67c27963619301772a5d.jpg" alt="">ZTE中兴 Spro 2 智能..</br>小有所投 大有所想</li>
            </ul>

            <p>
                <span></span><b>智能穿戴</b><span></span>
            </p>
            <ul>
                <li><img src="img/dcb3389a6da9312f2b14a0fd41fa7fd6.jpg" alt="">nubia watch</br>刚柔并济，表现不凡</li>
            </ul>

            <p>
                <span></span><b>电视盒子</b><span></span>
            </p>
            <ul>
                <li><img src="img/294ac29483e926188fb7f9903bc3cc27.jpg" alt="">魅盒</br>4K高清网络机顶盒</li>
            </ul>

            <p>
                <span></span><b>网络/路由</b><span></span>
            </p>
            <ul>
                <li><img src="img/fa153259978774e932314879a80435e7.jpg" alt="">分布式路由</br>穿墙王 覆盖无忧</li>
                <li><img src="img/17fcf9d305aad39687e89e03416eed84.jpg" alt="">4G CPE</br>4G室内无线路由器</li>
                <li><img src="img/d5630fb829c5d76c5ac5402a75f09470.jpg" alt="">5G CPE</br>X50平台、5G高速网络</li>
                <li><img src="img/4cab101eb11a95802b3edfba81dbad1e.jpg" alt="">MF920U</br>随身WIFI热点</li>
            </ul>

            <p>
                <span></span><b>智能家居</b><span></span>
            </p>
            <ul>
                <li><img src="img/5c428b3ec1963741846e674ef27f7fe2.jpg" alt="">小兴看看Memo微光全...</br>网络无线家庭监控</li>
                <li><img src="img/bebc6046529e2e10439f85a882867dd7.png" alt="">努比亚 VR全景相机</br>360°全景记录生活</li>
                <li><img src="img/f761b255160e1002592607396a2ed89b.jpg" alt="">nubia neo智能声波电...</br>清新从齿出发</li>
                <li><img src="img/629aa5a16ef0ecf4a3247fd13b1648b5.jpg" alt="">Nubia neo智能速干牙...</br>收纳 风干二合一</li>
            </ul>
        </div>
        <div class="Submenu">
            <p>
                <span></span><b>耳机</b><span></span>
            </p>
            <ul>
                <li><img src="img/32fce6b0e7d61c167498e99261ce4213.jpg" alt="">律音耳机</br>打造不将就听觉盛宴</li>
                <li><img src="img/bee67448455bdb4a6bdcf0cf7a4c7d82.jpg" alt="">ZTE LiveBuds</br>真无线蓝牙耳机</li>
            </ul>

            <p>
                <span></span><b>音响</b><span></span>
            </p>
            <ul>
                <li><img src="img/bc18d3e38b7b3e24959303aafeb43f8b.png" alt="">红魔战鼓</br>便携式户外防水</li>
                <li><img src="img/07720716474fc384943f7f56cc0e2d24.jpg" alt="">蘑菇蓝牙音箱</br>吸盘设计</li>
            </ul>
        </div>
        <div class="Submenu">
            <p>
                <span></span><b>移动电源</b><span></span>
            </p>
            <ul>
                <li><img src="img/92968aa65fbc75792a0811ee74d57046.jpg" alt="">中兴 移动电源 pQ100</br>10050mAh</li>
            </ul>

            <p>
                <span></span><b>电源适配器</b><span></span>
            </p>
            <ul>
                <li><img src="img/cdcaa43ee98f547f9113784d74039823.jpg" alt="">中兴无线充电器</br>支持 15W快充</li>
            </ul>
            <p>
                <span></span><b>数据线</b><span></span>
            </p>
            <ul>
                <li><img src="img/0b8e1829c256b7d38d6b8432e16d8c45.jpg" alt="">Type C 数据线</br>接口 二合一</li>
            </ul>
        </div>
        <div class="Submenu">
            <p>
                <span></span><b>保护套</b><span></span>
            </p>
            <ul>
                <li><img src="img/2e79316491902c601a509600f7e276e2.jpg" alt="">A11 Pro智能保护套</br>原装配件、品质保证</li>
                <li><img src="img/c8fb093d6755ef467c6bba91572aae9a.jpg" alt="">V9 智能皮套</br>原装配件、品质保证</li>
            </ul>

            <p>
                <span></span><b>保护壳</b><span></span>
            </p>
            <ul>
                <li><img src="img/8b14e8a01857193e7d844d34596e8bc2.jpg" alt="">Axon 10 Pro硅胶壳</br>原装配件、品质保证</li>
                <li><img src="img/9f29295ad246da6e7e4aa46e0d6e443e.jpg" alt="">A7s TPU</br>原装配件、品质保证</li>
            </ul>
            <p>
                <span></span><b>贴膜</b><span></span>
            </p>
            <ul>
                <li><img src="img/8900b319031f2ab751b2f2c281aaa628.jpg" alt="">天机Axon9 Pro 钢化膜</br>
                </li>
            </ul>
            <p>
                <span></span><b>存储卡</b><span></span>
            </p>
            <ul>
                <li>
                    <img src="img/f217f68f2ddfc90c82e7625a94e21c80.jpg" alt="">T-Flash内存卡</br>
                </li>
            </ul>
            <p>
                <span></span><b>自拍杆/支架</b><span></span>
            </p>
            <ul>
                <li><img src="img/98923b824f6432ec6b283761d279d86e.jpg " alt=" ">中兴自拍杆</br>
                </li>
            </ul>
        </div>
        <div class="Submenu ">
            <p>
                <span></span><b>增值服务</b><span></span>
            </p>
            <ul>
                <li><img src="img/rest.jpg " alt=" ">碎屏保</br>仅搭配套餐销售</li>
            </ul>

            <p>
                <span></span><b>文创产品</b><span></span>
            </p>
            <ul>
                <li><img src="img/f8d9c75ea5b1f2737bfe1ecf98f8e76d.png " alt=" ">文件袋</br>
                </li>
                <li><img src="img/75a7fc40fc86f0e566b6a2290a4b3748.png " alt=" ">文化衫</br>
                </li>
                <li><img src="img/5537cd4f4df52c7b5679c1815cd91298.png " alt=" ">帆布包</br>
                </li>
                <li><img src="img/f1f4f0ffa8632e3c5a2ceef909845659.png " alt=" ">随行杯</br>
                </li>
                <li><img src="img/680df493dd9724d3bbba9266ee1cae59.png " alt=" ">积木</br>
                </li>
                <li><img src="img/a3dd755a093b926b739d698d22914854.png " alt=" ">帽子</br>
                </li>
                <li><img src="img/c90f781e743680c7ca94e30c63d4710a.png " alt=" ">笔袋</br>
                </li>
                <li><img src="img/016b9dd744061a0450053f907f49e556.png " alt=" ">冰箱贴</br>
                </li>
                <li><img src="img/ab682d6a293e0170259837109b14a1b8.png " alt=" ">玻璃杯</br>
                </li>
                <li><img src="img/bb0001e875feeae05c377a2aedc135a5.png " alt=" ">硅胶杯盖</br>
                </li>
            </ul>
        </div>
    </div>
    <div class="body">
        <div class="body_introduce">
            <div class="notice ">
                <div class="text ">
                    <p><b>商城公告<span>请耐心等待，我们</span></b></p>
                    <dl>
                        <dt><img src="img/6fd680f3aa8b65ec835bfee40c7c6cb1.png" alt=""></dt>
                        <dd>官方正品</dd>
                    </dl>
                    <dl>
                        <dt><img src="img/cd57c5584abb89993b8f1af59d156d3f.png" alt=""></dt>
                        <dd>99元起免运费</dd>
                    </dl>
                    <dl>
                        <dt><img src="img/f55bccb566d87b68471b9b7ee93bf87b.png" alt=""></dt>
                        <dd>7天退货保障</dd>
                    </dl>
                    <dl>
                        <dt><img src="img/782753c9be3ba2f610fc194e97307292.png" alt=""></dt>
                        <dd>顺丰极速达</dd>
                    </dl>
                </div>
                <div class="img">
                    <img src="img/4387500e9913f2502d20ce943f6e90bb.jpg" alt="">
                    <img src="img/d7cfb7c5c3d540c2a86f69a9c58cdc2e.jpg" alt="">
                    <img src="img/9ea5978033120e0ee9b00ff02d6a7d08.jpg" alt="">
                </div>
            </div>
            <div class="tittle">
                <h5>推荐</h5>
                <h6>中兴精品推荐</h6>
            </div>
            <div class="timeLimit">
                <img src="img/c3651892ecdb42ee442f357ec854a1d6.jpg" alt="" class="big1">
                <div class="right1">
                </div>
                <div class="templete">
                    <a href="particulars.html">

                        <!-- <div id="kong">
                            <!-- //空 -->
                        <img src="../project 2/img2/k0.png" alt="">
                        <p></p>
                        <span></span>
                        <h3></h3>

                    </a>
                </div>
            </div>
            <div class="picture">
                <img src="img/630a5952577a1fdde7eee9d81896fb8f.jpg" alt="">
            </div>
            <div class="tittle">
                <h5>智能终端</h5>
                <h6>智慧生活必备</h6>
            </div>
            <div class="timeLimit">
                <img src="img/6cd7aa90c810e1b4d09b37440d4b7559.jpg" alt="">
                <div class="right">
                    <a href="">
                        <div>
                            <img src="img/bee67448455bdb4a6bdcf0cf7a4c7d82.jpg" alt="">
                            <p>ZTE中兴亲选 omthing联名 真无线蓝牙降噪耳机</p>
                            <span>双耳随心切换 高速传输</span>
                            <h3>￥199.00<b></b></h3>
                        </div>
                    </a>
                    <a href="">
                        <div>
                            <img src="img/e6a2f65f78581feef4b7a760ac5a4e42.jpg" alt="">
                            <p>MF920U 无线WiFi</p>
                            <span>插卡享高速网络   2000mAh大电池超长待机</span>
                            <h3>￥239.00<b>￥299.00</b></h3>
                        </div>
                    </a>
                    <a href="">
                        <div>
                            <img src="img/17fcf9d305aad39687e89e03416eed84.jpg" alt="">
                            <p>4G室内无线路由器</p>
                            <span>随插随用 畅想无限</span>
                            <h3> ￥399.00<b></b></h3>
                        </div>
                    </a>
                    <a href="">
                        <div>
                            <img src="img/927d4a689e61cfece8b5772048fdd076.jpg" alt="">
                            <p>中兴 魅盒</p>
                            <span>4K高清网络智能电视机顶盒</span>
                            <h3>￥99.00 <b>￥199.00</b></h3>
                        </div>
                    </a>
                    <a href="">
                        <div>
                            <img src="img/5c428b3ec1963741846e674ef27f7fe2.jpg" alt="">
                            <p>小兴看看Memo微光全彩版</p>
                            <span>1080P高清家用监控摄像头 360°云台红外夜监控器 手机wifi远程 网络无线家庭监控摄像头</span>
                            <h3>￥229.00<b></b></h3>
                        </div>
                    </a>
                    <a href="">
                        <div>
                            <img src="img/8900b319031f2ab751b2f2c281aaa628.jpg" alt="">
                            <p>中兴路由器 5G CPE</p>
                            <span>外观小巧精致，畅想5G高速率</span>
                            <h3>￥2699.00<b></b></h3>
                        </div>
                    </a>
                </div>
            </div>
            <div class="txt">
                <h4>原厂配件</h4>
                <span>换一换</span>
            </div>
            <div class="Box">
                <div class="element">
                    <div class="box">
                        <div class="element_count">
                            <img src="img/354396b9fce9ced11a6052fae8a9142f.png" alt="">
                            <p>Nubia neo智能速干牙刷消毒器</p>
                            <span>￥149.00</span>
                        </div>
                        <div class="element_count">
                            <img src="img/48b110bef60e05fd45f2a8375c86e1e4.png" alt="">
                            <p>nubia neo智能声波电动牙刷</p>
                            <span>￥169.00</span>
                        </div>
                        <div class="element_count">
                            <img src="img/a2ef83c3e7e5773a62866dd7c55bd445.png" alt="">
                            <p>努比亚 VR全景相机 黑色</p>
                            <span>￥299.00</span>
                        </div>
                        <div class="element_count">
                            <img src="img/32fce6b0e7d61c167498e99261ce4213.jpg" alt="">
                            <p>努比亚 律音耳机</p>
                            <span>￥69.00</span>
                        </div>
                        <div class="element_count">
                            <img src="img/7c1713ac9e9a2f02d83427ef6241ae10.jpg" alt="">
                            <p>Nubia红魔战鼓蓝牙音箱</p>
                            <span>￥88.00</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="express">
        <ul>
            <li>
                <img src="img/6fd680f3aa8b65ec835bfee40c7c6cb1.png" alt="">
                <h5>正品保障</h5>
            </li>
            <li>
                <img src="img/3481686fb1784c2d1f605ed122e9c524.png" alt="">
                <h5>15天换货承诺</h5>
            </li>
            <li>
                <img src="img/cd57c5584abb89993b8f1af59d156d3f.png" alt="">
                <h5>99元起免运费</h5>
            </li>
            <li>
                <img src="img/2c0baf608789ea427c1c07344d27f81b.png" alt="">
                <h5>全国售后网点</h5>
            </li>
            <li>
                <img src="img/782753c9be3ba2f610fc194e97307292.png" alt="">
                <h5>顺丰极速达</h5>
            </li>
            <li>
                <img src="img/f55bccb566d87b68471b9b7ee93bf87b.png" alt="">
                <h5>7天退货保障</h5>
            </li>
        </ul>
        <div class="serve">
            <div class="serve_count">
                <b>帮助中心</b></br>
                <span>购物指南</span><br>
                <span>支付方式</span><br>
                <span>配送指南</span><br>
                <span>结算</span><br>
            </div>
            <div class="serve_count">
                <b>售后服务</b></br>
                <span>退换货流程</span><br>
                <span>保修政策</span><br>
                <span>退换货政策</span><br>
                <span>售后网点</span><br>
            </div>
            <div class="serve_count">
                <b>关注我们</b></br>
                <span>官方微信</span><br>
                <span>中兴社区</span><br>
                <span>新浪微博</span><br>
            </div>
            <div class="serve_count">
                <b>关于我们</b></br>
                <span>商城简介</span><br>
                <span>礼品团购</span><br>
                <span>联系我们</span><br>
            </div>
            <div class="hotLine">
                <a href="">全国服务热线</a><br>
                <b>400-880-9999</b><br>
                <span>周一到周日9:00~24:00(全年无休息)</span></br>
                <img src="img/3fbfc85c1b12b1436a251d3e5d97ac141676959a.jpg" alt="">
            </div>
        </div>
    </div>
    <div class="foot">
        <div class="foot_count">
            <div>
                <a>中兴通讯</a>
                <a>中兴手机</a>
                <a>中兴智能家居</a>
                <a>努比亚（Nubia）</a>
                <a>互联网违法举报中兴</a>
            </div>
        </div>
        <p><span>服务协议 |隐私政策|</span>©2014 - 2020 深圳市中兴智谷科技有限公司版权所有，并保留所有权利 </p>
        <p>增值电信业务经营许可证：粤B2-20160352 | ICP备案证书号 :<span>粤ICP备16018970号|粤公网安备 44030502005102号|营业执照</span><img src="img/govIcon.gif" alt=""></p>
        <div class="service">
            <img src="img/1.png" alt="">
        </div>
    </div>

</body>

<script src="jquery.min.js"></script>

<script>
    $(".li ").mouseenter(function() {
        $(".img ").show()
    })
    $(".li ").mouseleave(function() {
        $(".img ").mouseenter(function() {
            $(".img ").show()
        })
        $(".img ").mouseleave(function() {
            $(".img ").hide()
        })
        $(".img ").hide()
    })
    $(".menu ul li ").mouseenter(function() {
        n = $(this).index()
        $(".Submenu ").eq(n).css({
            display: "block "
        })
    })
    $(".menu ul li ").mouseleave(function() {
        $(".Submenu ").mouseenter(function() {
            $(".Submenu ").eq(n).css({
                display: "block "
            })
        })
        $(".Submenu ").mouseleave(function() {
            $(".Submenu ").eq(n).css({
                display: "none "
            })
        })
        $(".Submenu ").css({
            display: "none "
        })
    })

    // 轮播babber图
    let imglist = $(".banner img")
    let p = $(".p")
    for (let i = 0; i < imglist.length; i++) {
        let newitem = p.clone()
        newitem.css({
            display: "block"
        })
        $(".dot").append(newitem)
    }
    $(".dot p").eq(0).addClass("show")
    let n = 0
    let changeimg = setInterval(function() {
        n++
        if (n >= imglist.length) {
            n = 0
        }
        imglist.css({
            display: "none"
        })
        imglist.eq(n).fadeIn()
        $(".dot p").removeClass("show")
        $(".dot p").eq(n).addClass("show")
    }, 4000)
    $(".dot p").click(function() {
        let m = $(this).index()
        n = m
        imglist.css({
            display: "none"
        })
        imglist.eq(m).fadeIn()
        $(".dot p").removeClass("show")
        $(".dot p").eq(m).addClass("show")
    })
    let box = $(".box")
    $(".txt span").click(function() {
        let newbox = box.clone()
        $(".element").append(newbox)
        $(".element").animate({
            marginLeft: "-100%"
        }, function() {
            $(".element").css({
                marginLeft: 0,
            })
            newbox.remove()
        })
    })
</script>

</html>